.box-container {
  width: 316px;
  backdrop-filter: blur(px);
  border-radius: 4px;
  position: inherit;
  backdrop-filter: blur(8px);
  background: linear-gradient(180deg, #0b323a 0%, rgba(11, 52, 69, 0.4) 100%);
  box-shadow: 0px 0px 16px rgba(14, 39, 47, 0.6);
  /* Note: backdrop-filter has minimal browser support */

  border-radius: 4px;
  -webkit-user-select: none; /*webkit浏览器*/
  -moz-user-select: none; /*火狐*/
  -ms-user-select: none; /*IE10*/
  user-select: none;
}

.box-title {
  font-weight: bold;
  font-size: 18px;
  color: #ffffff;
  height: 30px;

  padding: 2px 8px;
  background-image: url("../../assets/title-bg.png");
  background-size: 100% 100%;
  line-height: 30px;
  display: flex;
  /* justify-content: center; */
  align-items: center;
}

.box-content {
  /* padding: 8px 16px; */
  color: #dceaf8;
  text-align: justify;
  line-height: 26px;
  border-width: 0px;
  word-wrap: break-word;
  text-transform: none;
  font-size: 16px;
  font-weight: bold;
  line-height: 32px;
}

.box-card {
  padding: 16px;
  display: flex;
  flex-direction: row;
}

.single-card {
  width: 90px;
  /* height: 80px; */
  border: 1px solid #257985;
  border-radius: 2px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
  align-items: center;
}

.card-num {
  font-weight: 400;
  font-size: 24px;
  color: #ffffff;
}

.card-title {
  font-weight: 400;
  font-size: 14px;
  color: #dceaf8;
}

.card-container {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.select-part {
  display: flex;
  flex-direction: row;
  gap: 16x;
  height: 20px;
  /* line-height: 20px; */
  align-items: center;
  /* margin-left: 18px; */
}

.select-group {
  display: flex;
  flex-direction: row;
  gap: 38px;
  justify-content: space-between;
}

.info-part {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.info-tab {
  /* width: 130px; */
  display: flex;
  flex-direction: row;
  height: 40px;
  gap: 8px;
  justify-content: space-between;
}

.single-info {
  padding: 10px 8px;
  width: 126px;
  display: flex;
  flex-direction: row;
  text-align: center;
  height: 20px;
  font-weight: 400;
  justify-content: space-around;
  text-align: center;
  font-size: 16px;
  height: 44px;
  width: 156px;
  gap: 8px;
  color: #dceaf8;
  border: 1px solid #257985;
  /* background: linear-gradient(270deg, #1f4b55 0%, #12434e 100%); */
  background-color: rgba(31, 75, 85, 1);
  background-image: none;
  box-sizing: border-box;
  border: 1px solid rgba(37, 121, 133, 1);
}

.single-info .info-title {
  text-align: center;
  font-size: 16px;
  color: #dceaf8;
  font-weight: bold;
}

.single-info .info-num {
  font-weight: bold;
  font-size: 16px;
  color: #fff;
}

.select-display {
  display: flex;
  flex-direction: column;
  gap: 32px;
  font-size: 14px;
  pointer-events: all;
}

.select-title {
  color: #9ebbcb;
  display: flex;
  flex-direction: row;
  gap: 8px;
  display: inline-block;
  margin-right: 2px;
}

.select-content {
  width: 90px;
  height: 30px;
  font-weight: bold;
  background-color: #000 !important;
  background: linear-gradient(270deg, #1f4b55 0%, #12434e 100%) !important;
  border: 1px solid #165b65 !important;
  border-radius: 2px;
  color: #9ebbcb;
}

.select-content option {
  color: #9ebbcb;
}

.select-search {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}

.search-button {
  padding: 4px 0px;
  color: #dceaf8;
  width: 246px;
  text-align: center;
  background: linear-gradient(270deg, #288781 0%, #209ab5 100%);
}

.table-list {
  overflow-y: hidden;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  /* Firefox */
}

.table-title {
  display: flex;
  flex-direction: row;
  gap: 16px;
  color: #9ebbcb;
  background: linear-gradient(
    269.9999989836562deg,
    rgba(31, 75, 85, 1) -0%,
    rgba(18, 67, 78, 1) 100%
  );
  border: 1px solid rgba(22, 91, 101, 1);
  border-radius: 2px;
  font-weight: bold;
  justify-content: space-evenly;
  align-items: center;
  padding: 8px 0px;
}

.vertical-info {
  display: flex;
  flex-direction: row;
  gap: 16px;
  justify-content: space-between;
}

.eachInfo {
  background: linear-gradient(270deg, #1f4b55 0%, #12434e 100%);
  border: 1px solid rgba(37, 121, 133, 1);
  border-radius: 2px;
  width: 99px;
  height: 83px;
  display: flex;
  font-size: 14px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: #dceaf8;
  text-align: center;
}

.pic-content img {
  height: 184px;
  width: 328px;
}

.picText-content {
  display: grid;
  /* flex-direction: column; */
  grid-template-columns: repeat(2, 100px);
  gap: 67px;
  grid-gap: 67px!important;
  margin-top: 40px;
  pointer-events: all;
}

.companyExample-content{
  display: grid;
  /* flex-direction: column; */
  grid-template-columns: repeat(2, 138px);
  gap: 90px;
  grid-gap: 90px;
  margin-top: 40px;
  pointer-events: all;

}

.pic-text {
  display: flex;
  flex-direction: row;
  /* justify-content: space-between; */
  gap: 8px;
  align-items: center;
  height: 48px;
  /* background: linear-gradient(270deg, #1F4B55 0%, #12434E 100%); */
  /* border: 1px solid #257985; */
  border-radius: 2px;
  color: #dceaf8;
  padding: 2px;
  font-weight: bold;
}

.pic-big-text {
  /* width: 428px; */
  /* height: 70px; */
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  background: linear-gradient(270deg, #1f4b55 0%, #12434e 100%);
  border: 1px solid #257985;
  border-radius: 2px;
  color: #dceaf8;
  padding: 2px 4px;
  font-weight: bold;
}

.pic-text img {
  height: 100px;
  width: 160px;
}

.pic-big-text img {
  width: 291px;
  height: 72px;
}

.bold-text {
  font-weight: bold;
}

.link-bottom {
  width: 50%;
  height: 1px;
  border-top: solid rgba(84, 132, 166, 0.3) 1px;
}

.link-right {
  width: 1px;
  height: 100%;
  border-right: solid rgba(84, 132, 166, 0.3) 1px;
}

.link-whole {
  width: 100%;
  height: 1px;
  border-top: solid rgba(84, 132, 166, 0.3) 1px;
}

.g2-html-annotation {
  color: #000;
}

.vertical-count {
  font-weight: bold;
  font-size: 24px;
  color: #fff;
}

.list-name {
  font-size: 12px;
  color: #9ebbcb;
  font-weight: bold;
}

.table-list-info {
  font-size: 12px;
  display: flex;
  color: #fff;
  font-weight: bold;
  text-align: center;
  justify-content: center;
  pointer-events: all;
  align-items: center;
}

.table-info {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  color: #fff;
  padding: 8px 4px;
  vertical-align: center;
  
}

.table-height {
  height: 514px;
  overflow-y: auto;
}
.table-height::-webkit-scrollbar {
  width: 8px;
}
.table-height::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 5px rgba(13, 124, 207, 1);
  opacity: 0.2;
}
.table-height::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 5px rgba(57, 21, 214, 0.2);
  border-radius: 0;
}

/* ::-webkit-scrollbar {
  width: 0px;
} */

.refresh-btn {
  display: flex;
  align-items: center;
  color: #fff;
  margin-left: 10px;
}

.weather-display {
  display: flex;
  flex-direction: row;
  padding: 8px;
}

.weather-left {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: #fff;
  gap: 4px;
}

.weather-tempre {
  font-size: 48px;
}

.wind-direct {
  display: flex;
  flex-direction: row;
  gap: 8px;
  font-size: 14px;
  font-weight: bold;
}

.weather-pic {
  width: 200px;
}

/* .weather-part {
  display: flex;
} */

.weather-date {
  display: flex;
  padding: 8px 0px;
  flex-direction: row;
  justify-content: space-around;
}

.single-date {
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(37, 121, 133, 1);
  background-color: rgba(31, 75, 85, 1);
  width: 40px;
  height: 91px;
  justify-content: space-around;
  font-size: 14px;
  color: #9ebbcb;
  text-align: center;
}

.iconText-display {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
}

.single-column {
  display: flex;
  flex-direction: row;
  /* justify-content: space-around; */
  gap: 8px;
  pointer-events: all;
}

.single-content {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  border: 1px solid rgba(37, 121, 133, 1);
  background-color: rgba(31, 75, 85, 1);
  width: 156px;
  height: 40px;
  align-items: center;
}

.text-display {
  color: #fff;
  font-weight: bolder;
  font-size: 14px;
}

.symbol {
  font-size: 12px;
  font-weight: bolder;
  color: #fff;
}

.news-contain {
  display: flex;
  flex-direction: row;
  gap: 8px;
  /* height: 77px; */
}

.new-display {
  display: flex;
  flex-direction: column;
  gap: 16px;
  pointer-events: all;
}

.news-content {
  display: flex;
  flex-direction: column;
  color: #dceaf8;
  font-size: 14px;
  justify-content: space-around;
  font-weight: 400;
}

.news-titleAndTime {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.news-pic {
  width: 136px;
  height: 77px;
  border-radius: 2px;
}

.new-time {
  color: #9ebbcb;
}

.companyDetail-contain {
}

.company-info {
  display: flex;
  flex-direction: column;
  font-size: 16px;
  color: #dceaf8;
}

.company-picAndText {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}

.forward {
  height: 32px;
  width: 108px;
  text-align: center;
  line-height: 32px;

  background-size: 100% 100%;
  background-image: url(../../assets/forward.png);
}

.company-name {
  width: 176px;
  font-size: 14px;
}

.company-service {
  color: #dceaf8;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 14px;
}

.shouhuo-info {
  display: flex;
  flex-direction: column;
  font-size: 14px;
}

.service-box {
  display: flex;
  flex-direction: row;
  gap: 8px;
  background: linear-gradient(270deg, #1f4b55 0%, #12434e 100%);
  border-radius: 2px;
  padding: 8px;
  font-size: 14px;
  align-items: center;
}

.box-big-content {
  padding: 16px;
  gap: 16px;
  display: flex;
  flex-direction: column;
  pointer-events: all;
}

.list-pagination {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  color: #ffffff;
}

.picture-text-display {
  position: relative;
  margin-top: 30px;
}

.pic-texxt {
  height: 26px;
  position: inherit;
  display: inline-block;
  display: flex;
  top: -31px;
  justify-content: center;
  border: 1px solid rgba(37, 121, 133, 1);
  align-items: center;
  width: 158px;
}


.play-pic{
  position: inherit;
   height: 20px;
   width: 20px;
   top: -96px;
   left: 74px;
}

.pic-texxt-posi{
  position: inherit;
  display: inline-block;
  display: flex;
  top: -85px;
  justify-content: center;
  border: 1px solid rgba(37, 121, 133, 1);
  height: 26px;
  align-items: center;
  width: 198px;
}

.companySinglePic-texxt-posi{
  position: inherit;
  display: inline-block;
  display: flex;
  top: -81px;

  justify-content: center;
  border: 1px solid rgba(37, 121, 133, 1);

  align-items: center;
  width: 100px;
}

.companySinglePic-pic{
  position: inherit;

  top: -176px;
  left: 170px;
}

.companySinglePic-text-display{
  position: relative;

}